<template>
  <div class="change_data">
    <slot :show="show"></slot>
    <van-popup v-model="show" round position="bottom" @close="closePop">
      <van-cascader @change="onChange" v-model="cascaderValue" title="请选择所在地区" :options="options" :closeable="false"
        :field-names="fieldNames">
        <template #title>
          <div class="set_title">

            <div class="title">筛选所属员工</div>
            <div>

              <van-button class="f-26" style="margin-right:10px" @click="cancel">清除筛选</van-button>
              <van-button class="f-26" @click="confirm">确定</van-button>
            </div>
          </div>
        </template>
      </van-cascader>
    </van-popup>
  </div>
</template>

<script>
  import {
    UserService
  } from '@/api'
  export default {
    name: 'SearchPerson',
    model: {
      prop: 'control_search',
      event: 'change',
    },
    props: {
      control_search: {
        type: Boolean,
        default: false
      },
      search_type: String
    },
    mounted() {
      console.log(112);
      this.setOptions();
    },
    methods: {
      onChange({
        selectedOptions,
        value
      }) {

        console.log(113);
        if (!value) {

          UserService.getUnder({
            user_id: value
          }).then(res => {
            let selectIds = selectedOptions.reduce((result, item, index) => {
              console.log(index, 'up')
              result.push(item.id);
              return result;
            }, [])
            console.log(selectIds, 'down')
            let len = selectIds.length;
            selectIds.reduce((again, item, index) => {
              let s_index = again.reduce((select_id, s_item, s_index) => {
                if (s_item.id == item) {
                  return s_index;
                } else {
                  return select_id;
                }
              }, 0)
              if (index == (len - 1) && !this._.isEmpty(res.data)) {
                // debugger;
                this.$set(again[s_index], 'items', res.data)
              } else {
                let tmp = again[s_index]['items']
                return tmp
              }
            }, this.options)
          })
        }
      },
      change_pop() {
        this.show = true;
      },
      setOptions() {
        UserService.getUnder().then(res => {
          console.log(res)
          this.options = res.data
        })
      },
      confirm() {
        this.$store.commit('SET_SEARCH', this.cascaderValue)
        // this.$EventBus.$emit('change_list');
        this.handle_update();
        this.show = false;
      },
      handle_update() {
        if (this.search_type == 'franchisee') {
          this.$EventBus.$emit('update_franchisee');
        } else {
          
          this.$parent.$parent.init();
        }
      },
      cancel() {
        this.$store.commit('SET_SEARCH', '')
        this.handle_update();
        // this.$EventBus.$emit('update_list');
        this.show = false;
      },
      closePop() {
        // this.setOptions();
        this.show = false;
      }
    },
    data() {
      return {
        show: false,
        cascaderValue: '',
        fieldNames: {
          text: 'name',
          value: 'id',
          children: 'items'
        },
        options: [{
            name: '浙江省',
            code: '330000',
            items: [{
              name: '杭州市',
              code: '330100',
              items: [{
                name: '杭州市1',
                code: '330101',
                items: [{
                  name: '杭州市2',
                  code: '330102',
                  items: [{
                    name: '杭州市3',
                    code: '330103',
                    items: [{
                      name: '杭州市4',
                      code: '330104',
                      items: [{
                        name: '杭州市5',
                        code: '330105',
                        items: [{
                          name: '杭州市6',
                          code: '330106',
                          items: [{
                            name: '杭州市7',
                            code: '330107'
                          }]
                        }]
                      }]
                    }]
                  }]
                }]
              }]
            }],
          },

        ],
      };
    },
  }
</script>

<style lang="less" scoped>
  /deep/.van-cascader__header {
    width: 700px;
    margin: 0 auto;
  }

  /deep/.van-cascader__title {
    width: 100%;

  }

  /deep/ .van-cascader__option {
    font-size: 24px;
  }

  /deep/ .van-tab {
    font-size: 24px;
  }


  .change_data {


    .set_title {
      display: flex;

      justify-content: space-between;
      align-items: center;

      .title {
        font-size: 26px;
      }
    }

    .icon_size {
      width: 26px;
      height: 26px;
      margin-right: 12px;
    }
  }
</style>